<template>
    <div class="custom-comp"><slot></slot></div>
</template>
<style scoped>
    .custom-comp {
        position:  relative;
        width: 100%;
        /* the height value is based on content height */
      }
</style>
<script> 
    export default{
      //在添加dom的时候做操作,2.0已经废弃这个生命周期,像react过渡了.使用mounted或者beforeDestroy的lifecycle hook,在这些hooks中做处理.
        attached(){
          var self = this
          pending(function () {
            return !!self.$el.offsetHeight
          }, function () {
            // console.log('el:', self.$el, 'offsetHeight:', self.$el.offsetHeight)
              self.$parent.height = self.$el.offsetHeight
              self.$parent.width = self.$el.offsetWidth
           
          }, 50, 1000)

        }
    }
     function pending (check, cb, interval, timeout) {
        var startTime = Date.now();
        (function handler () {
          if (check()) {
            cb()
          } else if (Date.now() - startTime < timeout) {
            setTimeout(handler, interval)
          }
        })()
      }
</script>